import React, { useState, useEffect } from 'react';
import { Tabs, Input, Form, Button, message } from 'antd';
import type { TabsProps } from 'antd';
import * as user from '../../../api/user'
function Personal(props: any) {
    interface DataType {
        key: string;
        name: string
        rolename: string;
        people: string;
        remake: string;
        state: string;
        id: string;

    }
    // 编辑用户
    var [form] = Form.useForm()
    // 获取个人信息
    let yonghu: any = {}
    let geren = async () => {
        var res = await user.system_personals_list()
        console.log(res.data[0])
        form.setFieldsValue(res.data.data[0])
        yonghu = res.data[0]
    }
    useEffect(() => {
        geren()
    })
    // 信息表单验证成功
    let onFinishs = async (values: any) => {
        values.id = yonghu.id
        console.log(yonghu)
        var res = await user.system_personals_edit({values,"number": "GH2000011220", "idcard": "352125435841", "payable": "1500.00", "actual": "1000.00"})
        console.log(res)
        message.success('保存成功', 2)
    }
    // 信息表单验证失败
    let onFinishFaileds = () => {
        console.log(96520)
    }
    // 编辑用户
    var [forms] = Form.useForm()
    // 修改密码表单验证成功
    let onFinish = async (values: any) => {
        values.id = yonghu.id
        if (yonghu.password == values.oldpassword) {
            if (values.newpassword == values.password) {
                let { oldpassword, newpassword, ...newvalues } = values
                newvalues.password = newpassword
                var res = await user.system_personals_edit(newvalues)
                message.success('修改成功', 2)
                setTimeout(() => {
                    forms.setFieldsValue({ password: '', oldpassword: '', newpassword: '' })
                }, 2000);
            } else {
                message.error('两次密码不一致', 2)
            }

        } else {
            message.error('原密码不正确', 2)
        }

    }
    // 修改密码表单验证失败
    let onFinishFailed = () => {
        console.log(456)
    }

    // 设置添加编辑开关
    // const [flag, setFlag] = useState(true)

    // 个人信息
    let xinxi = () => {
        return (
            <Form
                name="basic"
                form={form}
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 16 }}
                style={{ maxWidth: 300 }}
                onFinish={onFinishs}
                onFinishFailed={onFinishFaileds}
            >
                <Form.Item
                    label="账号"
                    name="adminname"
                >
                    <Input bordered={false} disabled={true} />
                </Form.Item>
                <Form.Item
                    label="姓名"
                    name="name"
                >
                    <Input bordered={false} disabled={true} />
                </Form.Item>
                <Form.Item
                    label="部门"
                    name="department"
                >
                    <Input bordered={false} disabled={true} />
                </Form.Item>
                <Form.Item
                    label="岗位"
                    name="post"
                >
                    <Input bordered={false} disabled={true} />
                </Form.Item>
                <Form.Item
                    label="电子邮箱"
                    name="email"
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="手机号"
                    name="iphone"
                >
                    <Input />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                    <Button type="primary" htmlType="submit">
                        保存
                    </Button>
                </Form.Item>
            </Form>
        )
    }
    // 修改密码
    let password = () => {
        return (
            <Form
                name="basic"
                form={forms}
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 16 }}
                style={{ maxWidth: 400 }}
                initialValues={{ remember: true }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
            >
                <Form.Item
                    label="原密码"
                    name="oldpassword"
                    rules={[{ required: true, message: '请输入原密码' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="新密码"
                    name="newpassword"
                    rules={[{ required: true, message: '请输入新密码' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="重复新密码"
                    name="password"
                    rules={[{ required: true, message: '请重复新密码' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                    <Button type="primary" htmlType="submit">
                        修改
                    </Button>
                </Form.Item>
            </Form>
        )
    }
    const onChange = (key: string) => {
        console.log(key);
    };
    const items: TabsProps['items'] = [
        {
            key: '1',
            label: `我的信息`,
            children: xinxi(),
        },
        {
            key: '2',
            label: `修改密码`,
            children: password(),
        }
    ];
    return (
        <div className='personal' style={{ background: '#fff' }}>
            <div className='nei' style={{
                width: '96%', height: 500, margin: 'auto', border: '1px solid #ddd'
            }}>
                <Tabs defaultActiveKey="1" items={items} onChange={onChange} />
            </div>
        </div>
    );
}

export default Personal;